const PATH = require("path");
const FS = require("fs");
var webpack = require("webpack");
const {
	BundleAnalyzerPlugin
} = require("webpack-bundle-analyzer");
const LodashModuleReplacementPlugin = require("lodash-webpack-plugin");

// 剥离不必要的语言环境仅打包使用的语言环境
const MomentLocalesPlugin = require("moment-locales-webpack-plugin");
const resolve = (dir) => {
	return PATH.join(__dirname, dir);
};

function loadGlobalStyles() {
	const STYLE_BASE = FS.readFileSync("src/assets/styles/base.scss", "utf-8");
	const STYLE_VAR = FS.readFileSync("src/assets/styles/color.scss", "utf-8");
	return STYLE_BASE + STYLE_VAR;
}

// 解决更新后需要客户手动刷新浏览器问题
const Timestamp = new Date().getTime();
// const fs = require('fs');
let testVersion = require('./public/version.json') || [];


module.exports = {
	// 如果你不需要使用eslint，把lintOnSave设为false即可
	lintOnSave: false,
	configureWebpack: {
		plugins: [new MomentLocalesPlugin()],
	},
	assetsDir: "static",
	publicPath: '/',
	chainWebpack: (config) => {
		testVersion = {
			version: Timestamp
		};
		FS.writeFile('./public/version.json', JSON.stringify(testVersion), () => {
			console.log(testVersion.version);
		});
		// 配置路径别名，在项目中可缩减引用路径
		config.resolve.alias
			.set("@", resolve("src"))
			.set("_a", resolve("src/assets"))
			.set("_c", resolve("src/components"))
			.set("_p", resolve("src/pages"));
		// 解决iview 按需引入babel转换问题
		config.module
			.rule("view-design") // 我目前用的是新版本的iview ,旧版本的iview，用iview代替view-design
			.test(/view-design.src.*?js$/)
			.use("babel")
			.loader("babel-loader")
			.end();
		config
			.plugin("ignore")
			.use(new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)); //忽略/moment/locale下的所有文件
		config.plugin("analyzer").use(new BundleAnalyzerPlugin()); //使用webpack-bundle-analyzer 生成报表
		// config.plugin("loadshReplace").use(new LodashModuleReplacementPlugin()); //优化lodash
	},
	// 配置全局CSS
	css: {
		loaderOptions: {
			sass: {
				prependData: loadGlobalStyles(),
			},
		},
	},
	// 多页面应用配置页面
	pages: {
		// 主页
		index: {
			// 页面入口
			entry: "src/pages/index/index.js",
			// 页面的HTML
			template: "public/index.html",
		},
		user: {
			entry: "src/pages/user/index.js",
			template: "public/user.html",
		},
		login: {
			entry: "src/pages/login/index.js",
			template: "public/login.html",
		},
	},
	// 解决跨域问题
	devServer: {
		// 修改端口
		port: 8080,

		proxy: {
			// 接口地址
			"/api": {
				// 你要请求的后端接口ip+port
				target: "https://pre-gateway.190.vip/",
				// target: "https://gateway.190.vip",
				// target: 'https://gateway.huimi.vip/',
				// target: 'http://test-gateway.190.vip',
				// target: 'http://qwerer.gnway.cc:8000',
				// 允许跨域，在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
				changeOrigin: true,
				// 开启webSocket
				ws: true,
				// 替换成target中的地址
				pathRewrite: {
					"^/api": "/",
				},
			},
		},
	},
};
